<template>
    <header class="header">
      <h1>小黑记事本</h1>
      <input v-model.trim="todo" placeholder="请输入任务" class="new-todo" @keyup.enter="add" />
      <button @click="add" class="add">添加任务</button>
    </header>
  </template>
  
  <script>
  export default {
  data(){
    return{
        todo:''
    }
  },methods:{
    add(){
        if(!this.todo){
            alert('任务不能为空')
            return
        }
        // 包赚对象
        const obj ={
            id:Math.floor(Math.random()*1000000),
            title:this.todo
        }
        // 发射自定义事件
        this.$emit('addTodo',obj)
        this.todo=''
    }
  }
  }
  </script>
  
  <style></style>